<template>
  <THeader title="详细信息"></THeader>
  <div v-for="(apply,index) in applyInfo" :key="index">
    <van-cell-group inset style="margin-top:15px" v-for="(applyI,indexI) in apply.sources" :key="indexI">
      <van-cell>
        <template #title>
          <span style="height:100%;border-left: 5px solid #1989fa; margin-right: 5px"/>
          <span style="font-size: 4.5vw">{{ apply.course }}</span>
        </template>
      </van-cell>

      <van-cell>
        <van-row style="color: #969799">
          <van-col span="8">{{ getDay(applyI) }}</van-col>
          <van-col span="8">{{ getPart(applyI) }}</van-col>
          <van-col span="8">{{ getWeek(applyI) }}</van-col>
        </van-row>
        <van-row style="color: #969799;padding-top: 1.5rem">
          <van-col span="3">
            班级
          </van-col>
          <van-col offset="2">
            {{ apply.classes }}
          </van-col>
        </van-row>
      </van-cell>
    </van-cell-group>
  </div>

  <van-cell-group inset style="margin-top: 5vw">
    <van-cell>
      <van-row>
        <van-col span="6" style="color:#4b4c4d;">申请理由：</van-col>
        <van-col offset=2 span="16">{{ reason }}</van-col>
      </van-row>
    </van-cell>
  </van-cell-group>
</template>

<script>
import {useRoute} from "vue-router/dist/vue-router";
import {getAdjustById} from "/@/api/ttsq";

export default {
  setup() {
    const route = useRoute()
    const id = route.query.id
    const applyData = reactive({
      applyInfo: [],
      reason: route.query.reason
    })
    const initData = async () => {
      const res = await getAdjustById(id);
      // console.log("res",res.response.value.extend.records)
      applyData.applyInfo = res.response.value.extend.records
      // console.log(applyData.applyInfo)
    }

    const getDay = (value) => {
      console.log("111111111", value.split(" ")[0])
      return value.split(" ")[0]
    }
    const getPart = (value) => {
      return value.split(" ")[2]
    }
    const getWeek = (value) => {
      return value.split(" ")[3]
    }
    onMounted(() => {
      initData();
    })

    return {
      ...toRefs(applyData),
      getDay,
      getPart,
      getWeek,
    }
  }
}
</script>

<style scoped>

</style>
